<template>
  <!-- 消息更多 -->
  <div class="page_padding">
    <MyNavBar @goback="goback" :title="title" />
    <div class="tab_con">
      <!-- <van-tabs @change="onChange" swipeable v-model="activeTab" sticky>
        <van-tab title="测评结果" name="1"></van-tab>
        <van-tab title="签到表" name="2"></van-tab>
      </van-tabs> -->
      <van-dropdown-menu active-color="#EE0A24" v-if="searchParams.screen == '1'">
        <van-dropdown-item v-model="searchParams.title" :options="quarterSelect" @change="onChangeTitle" />
        <van-dropdown-item v-model="orgIdValue" :options="orgList" @change="onChangeOrg" />
        <!-- <van-dropdown-item
          v-if="activeTab === '1'"
          v-model="searchParams.type"
          :options="peopleType"
          @change="onChangeType" /> -->
      </van-dropdown-menu>
      <div class="result" v-if="activeTab === '1'">
        <!-- <div class="desc">
          <div class="big_title">民主测评结果计票单</div>
          <div class="little_title">2021年第3季度非领导成员</div>
          <div class="info">2021年11月24日（8：00---9：00）召开民主测评会，应到35人，实到33人，实投31人。</div>
        </div> -->
        <!-- <div class="content">
        </div> -->
        <result-table :searchParams="searchParams"></result-table>
      </div>
      <div class="result" v-if="activeTab === '2'">
        <!-- <div class="desc">
          <div class="big_title">民主测评签到表（2021年第3季度）</div>
          <div class="little_title">2021年第3季度非领导成员</div>
          <div class="info">2021年11月24日（8：00---9：00）召开民主测评会，应到35人，实到33人，实投31人。</div>
        </div> -->
        <!-- <div class="content">
        </div> -->
        <!-- <sign-table :searchParams="searchParams"></sign-table> -->
      </div>
    </div>
  </div>
</template>

<script>
import {
  // listQuarterSelect,
  listAssessmentOrgan,
  getNoCivilNeedAssessByOrgId,
  getQuarterAssessPeriods,
} from '@api/api-democratic.js'

import MyNavBar from '@com/MyNavBar'
import resultTable from './components/resultTable.vue'
// import signTable from "./components/signTable.vue";
export default {
  name: 'userNotificationDetail',
  components: { MyNavBar, resultTable },
  props: {},
  data() {
    return {
      title: '测评结果',
      activeTab: '1',
      id: this.$route.query.id,
      userInfo: JSON.parse(localStorage.userInfo),
      peopleType: [
        { text: '领导成员', value: 1 },
        { text: '非领导成员', value: 2 },
        { text: '非公务员', value: 5 },
      ],
      titleValue: '',
      quarterSelect: [],
      orgIdValue: '',
      orgList: [],
      searchParams: {
        title: '',
        type: 2,
        screen: '0',
      },
    }
  },
  mounted() {
    if (!this.id) {
      this.title = '测评管理'
      this.searchParams.screen = '1'
      this.initQuarterData()
    } else {
      this.title = '测评结果'
      this.searchParams.type = ''
      this.searchParams.screen = '0'
    }
  },
  methods: {
    /* 初始化季度数据 */
    initQuarterData() {
      getQuarterAssessPeriods().then(res => {
        if (res.status === 200) {
          let arr = []
          const data = res.data || []
          for (let i = 0; i < data.length; i++) {
            arr.push({
              text: data[i].periodName,
              quarter: data[i].quarter,
              year: data[i].year,
              value: data[i].periodName,
            })
          }
          this.searchParams.title = arr[0].text
          this.quarterSelect = arr.concat()
          this.initOrganData()
        }
      })
    },
    // 处理季度数据
    handleQuarter(str) {
      if (!str) return {}
      let year = str.slice(0, 4)
      let quarter = 1
      if (str.includes('第一')) {
        quarter = 1
      } else if (str.includes('第二')) {
        quarter = 2
      } else if (str.includes('第三')) {
        quarter = 3
      } else {
        quarter = 4
      }
      return { year, quarter }
    },
    /* 初始化机构数据 */
    initOrganData() {
      let { year = '', quarter = '' } = this.handleQuarter(this.searchParams.title || '')
      listAssessmentOrgan({
        distinctLevel: this.userInfo.loginPostInfo.districtLevel,
        tenantId: this.userInfo.tenantId,
        status: '0', // 全部
        year,
        quarter,
      }).then(res => {
        let data = res.data
        this.orgIdValue = data[0].id
        this.searchParams = { ...this.searchParams, ...data[0] }
        this.orgList = [...data]
        this.orgList.forEach(item => {
          item.text = item.orgName
          item.value = item.id
        })
        this.getNoCivilNeedAssessByOrgId()
      })
    },
    /* 监听切换 */
    onChangeOrg(value) {
      // console.log(value)
      let orgIdData = this.orgList.filter(item => item.id == value)[0]
      this.searchParams = { ...this.searchParams, ...orgIdData }
      // if (['02.01.0001.0002.0003', '02.01.0001.0002.0001'].includes(this.searchParams.orgId)) {
      //   this.peopleType = [
      //     { text: '领导成员', value: 1 },
      //     { text: '非领导成员', value: 2 },
      //     { text: '非公务员', value: 5 },
      //   ]
      // } else {
      //   this.peopleType = [
      //     { text: '领导成员', value: 1 },
      //     { text: '非领导成员', value: 2 },
      //   ]
      // }
      this.getNoCivilNeedAssessByOrgId()
    },
    /* 监听切换 */
    onChangeTitle(value) {
      console.log(value, this.searchParams.title)
      this.orgIdValue = ''
      this.searchParams.id = ''
      this.initOrganData()
    },
    /* 监听切换 */
    onChangeType(value) {
      // this.searchParams.type = value
    },
    goback() {
      this.$router.go(-1)
    },
    getNoCivilNeedAssessByOrgId() {
      getNoCivilNeedAssessByOrgId({ oneParam: this.searchParams.id }).then(res => {
        if (res.status === 200) {
          if (res.data.length > 0) {
            this.peopleType = [
              // { text: '领导成员', value: 1 },
              { text: '非领导成员', value: 2 },
              // { text: '非公务员', value: 5 },
            ]
          } else {
            this.peopleType = [
              // { text: '领导成员', value: 1 },
              { text: '非领导成员', value: 2 },
            ]
          }
        }
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.tab_con {
  width: 100%;
  background-color: #fff;
  z-index: 10;
  // padding: 0 14px;
  .van-tabs {
    border-bottom: 1px solid #f7f7f7;
  }
  .desc {
    text-align: center;
    font-size: 13px;
    margin-top: 15px;
    .big_title {
      font-size: 16px;
      font-weight: bold;
    }
    .little_title {
      font-weight: bold;
      margin-top: 6px;
    }
    .info {
      margin-top: 10px;
    }
  }
  .van-dropdown-menu {
    // background: #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
  }
  /deep/.van-dropdown-menu__bar {
    // background: #f2f2f2;
    box-shadow: none;
  }
  /deep/.van-dropdown-menu__title {
    font-size: 14px;
  }
  /deep/.van-dropdown-menu__title::after {
    border-color: transparent transparent #333 #333;
  }
  .result {
    padding: 0 14px;
  }
  .content {
    margin-top: 10px;
  }
}
</style>
